<style lang="scss" scoped src="./entries.scss"></style>

<template lang="html">
  <section class="components-personal-entries">
    <div class="userpage_useroperation_book">
      <p class="entries-title">
        <span class="userpage_useroperation_book_mybook isCoach">最近课程的学员</span>
      </p>
      <p class="userpage_useroperation_book_count" :class="{ active: course !== null }" @click="goToLatestCourse">
        <template v-if="course !== null">
          有<span>{{currentNumber}}</span>位学员
        </template>
        <template v-else>
          暂无预约课程
        </template>
      </p>
    </div>
    <div class="UserPage_useroperation_ticket" @click="$router.push({ path: `/coach-orders/${info.coachId}` })">
      <p class="entries-title">
        <span class="UserPage_useroperation_ticket_search isCoach">我的所有课程</span>
      </p>
      <p class="UserPage_useroperation_ticket_convert">我的上课安排</p>
    </div>
    <div class="UserPage_useroperation_help" @click="$emit('applyForCourse')">
      <p class="entries-title">
        <span class="UserPage_useroperation_help_contact isCoach">我要开训练营</span>
      </p>
      <p class="UserPage_useroperation_help_wechat">自己开课</p>
    </div>
    <div class="UserPage_useroperation_more">
      <p>更多功能敬请期待</p>
    </div>
  </section>
</template>

<script>
export default {
  name: 'entries-coach',
  props: {
    info: {
      type: Object,
      required: true
    },
    course: {
      type: null,
      required: true
    },
  },
  computed: {
    currentNumber(){
      if(this.course === null) return 0
      let max = parseInt(this.course.maxNum, 10),
          cur = max - parseInt(this.course.number, 10)
      if(cur < 0){
        return 0
      } else if(cur > max){
        return max
      } else {
        return cur
      }
    }
  },
  methods: {
    goToLatestCourse(){
      if(this.course === null) return
      this.$router.push({ path: `/coach-order/${this.course.subjectId}` })
    }
  }
}
</script>
